iT邦幫忙

2021 iThome 鐵人賽

DAY 27
1
Software Development

你還在用手動測試嗎?30 天帶你學會前端自動化測試框架 - Cypress系列 第 27

自動化測試,讓你上班擁有一杯咖啡的時間 | Day 27 - 學習 cypress window 的用法

  • 分享至 

  • xImage
  •  

此系列文章會同步發文到個人部落格,有興趣的讀者可以前往觀看喔。

今天要跟大家分享當網站有用到 Javascript prompt 時,要如何測試。

cy.window(): Get the window object of the page that is currently active.

cy.window()
cy.window(options)

cy.stub(): Replace a function, record its usage and control its behavior.

cy.stub()
cy.stub(object, method)
cy.stub(object, method, replacerFn)
  1. Javascript prompt: 輸入文字用,會有一個輸入框和確認/取消按鈕
    https://ithelp.ithome.com.tw/upload/images/20211011/201408835MdliVInxY.png

  2. 動手寫程式

    describe('JavaScript Alerts, Confirm, Prompt in Cypress', () => {
    
        beforeEach(() => {
            cy.visit('https://www.seleniumeasy.com/test/javascript-alert-box-demo.html')
        })
    
        it('JS Prompt - 輸入文字並按確定', () => {
            cy.window().then(($win) => {
                cy.stub($win, 'prompt').returns('Jennifer') 
                cy.get('.row > .col-md-6 > .panel:nth-child(6) > .panel-body > .btn').click() //點選按鈕
            })
            cy.get('#prompt-demo').contains("You have entered 'Jennifer' !") //應該要有You have entered 'Jennifer' !
        })
    
    })
    
  3. 結果
    https://ithelp.ithome.com.tw/upload/images/20211011/201408831z5AN3iRVe.png

參考資料


上一篇
自動化測試,讓你上班擁有一杯咖啡的時間 | Day 26- 學習 cypress filter 的用法
下一篇
自動化測試,讓你上班擁有一杯咖啡的時間 | Day 28 - cypress 截圖與影片
系列文
你還在用手動測試嗎?30 天帶你學會前端自動化測試框架 - Cypress30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言